1//
function flContentNav() {
  $.ajax({
    type: "get",
    url: "../api/commodityAll.json",
    dataType: "json",
    success(data) {
      let htmlStr = '';
      htmlStr += `
      
          <ul class="navList">
      `
      data.forEach((item) => {
        htmlStr += `
            <li>${item.title}</li> 
        `
      })
      htmlStr += `
          </ul>
      
      `
      $(".fl-searchContent .nav").html(htmlStr);
      $(".navList>li").eq(0).addClass("active");
    }
  })
}
flContentNav();



function flContentList() {
  $.ajax({
    type: "get",
    url: "../api/commodityAll.json",
    dataType: "json",
    success(data) {
      let htmlStr = '';
      htmlStr += `
        <li>`
      data.forEach((item) => {
        htmlStr += `
         <div class="commodityBox">
      `
        $(item.content).forEach((item1) => {
          htmlStr += ` 
           
            <a href="./pingguo.html" class="commodityList">
              <img src="${item1.src}">
              <p>${item1.title}</p>
            </a>  
        `
        })

        htmlStr += `
        </div>
        
         `
      })
      htmlStr += `
      </li>
      `

      $(".fl-searchContent .listContent").html(htmlStr);
    }
  })
}
flContentList();


//tab切换
function tab() {
  // $(".nav li").eq(0).addClass("active");
  $(".nav").on("click", function (e) {
    if (e.target.tagName == "LI") {
      // console.log(e.target)
      var i = $(e.target).index()
      // console.log(i)

      $(".nav li").eq(i).addClass("active").siblings().removeClass("active");
      $(".listContent .commodityBox").eq(i).show().siblings().hide();
    }
  })
}
tab();


//点击事件跳转页面



// 分类里的search
function search() {
  var ipt = document.querySelector(".fl-search input");
  var find = document.querySelector(".text");
  var mask = document.querySelector(".mask");
  ipt.onfocus = function () {
    // console.log(1)
    mask.style.display = "block";
  }
  ipt.onblur = function () {
    // console.log(2)
    mask.style.display = "none";
  }

  //按键事件
  ipt.onkeyup = function (event) {
    //按键时获取搜索框中的内容
    var keywords = this.value;
    if (keywords.length == 0) return;
    // ajax把数据传向服务端
    $.ajax({
      type: "get",
      url: "../api/pingguo.php?keywords=" + keywords,
      dataType: "json",
      success(data){
        // console.log(data);
        if(event.keyCode==13){
          location.href="pingguo.html";
          keywords = "";
        }
      }
    })
  }


}
search();
